import React, { Component } from 'react'
import config from './config'
import ReactDOM from 'react-dom'
import { toast, base, createPage, promptBox } from 'nc-lightapp-front'
import { initTemplate, afterEvent, searchClick } from './events'
import OrderTableArea from './compontents/order-table-area';
import requestApi from './requestApi'
import { setSearch } from 'src/erm/sscrppublic/common/utils/setComponentUsed'
import './index.less'
import TicketBag from '../bag/index'
import CheckInVoice from '../check-invoice'
import { get } from 'lodash'
import imgUrl from '../../wallet/card/img/bag-contro.svg'
const { NCButton, NCTabs, NCPopover, NCModal } = base
const NCTabPane = NCTabs.NCTabPane
window.invoicePageCode = {
	searchPage: '201102BCLF_FPLC'
}
window.InvoiceWalletAreaCode = {
	searchArea: 'search',
	billsArea: 'head',
	bodysArea: 'body'
}

export default class InvoiceWallet extends Component {
	deleteList = {} // 待删除列表
	orderDeleteList = {}
	invoiceList = [] // 当前展示的发票列表数据 [{head: {head: {}}, body:{body: {}}}]  body是可选的
	orderList = [];//当前展示订单列表数据
	// 当前票袋活动pk主键
	ticketBagActiveId = 'all'
	// 发票和订单的tab值
	listTabStatus = '0'
	constructor(props) {
		super(props)
		setSearch(props, window.InvoiceWalletAreaCode.searchArea)
		this.state = {
			showInvoiceWalletModal: true,
			navTabStatus: '33',
			// 移动到按钮的列表加载数组
			ticketBagArr: [
				//     {
				//         "pk_erminvoice_bag":"all", // 唯一标志
				//         "bagname":"全部",// 票袋名称
				//         "pk_psndoc":"1001A51000000000301A",
				//         "pk_group":"0001A5100000000012MI",
				//         "pk_org":"0001A5100000000072UO",
				//         "dr":"0",
				//         "ts":"2022-05-1717:15:59",
				//         "valueIndex":{},
				//         "status":"0",
				//         "m_isDirty":false
				//     }
			],
			// 移动到的票袋pk主键
			moveBagPk: null,
			// 是否显示左侧票袋列表
			bagIsHidden: false,
			// 是否显示移动到的确认提示框
			showMoveTagModal: false,
			// 是否显示移动到的列表
			showMovelist: false,
			// 表格的数据
			tableInvoiceDataArr: [],
			// 是否显示右侧查看发票
			checkInvoceIsHidden: true,
			// 查看的数据行数据
			checkRowData: null,
			// 移动到的票袋名称
			moveBagName: null,
			// 移动到显示字符串的最大长度
			nCPopoverMoveShowValueMaxLength: 12,
			tabData: [
				{ title: (this.props.multiLangJson||{})["201101-GRFP-DBX"] || '待报销', key: '33' },
				{ title: (this.props.multiLangJson||{})["201101-GRFP-BXZ"] || '报销中', key: '36' },
				{ title: (this.props.multiLangJson||{})["201101-GRFP-YBX"] || '已报销', key: '39' }
			],
			// 表格默认高度
			initHeight: null,
			// 勾选的数据~~~state中的声明
			deleteListSelf: {},
			// 弹窗整体高度
			transfertableMain: null,
			listTabData: [
				{ title: '发票', key: '0' },
				{ title: '订单', key: '1' }
			]
		}

		let { search } = this.props
		let { setSearchValByField, getAllSearchData } = search
		this.setSearchValByField = setSearchValByField // 设置查询区某个字段值
		this.getAllSearchData = getAllSearchData // 获取查询区所有字段数据

		this.isError = false // 转单编辑后字段是否通过验证
		// if (this.props.showInvoiceWalletModal) {
		//     initTemplate.call(this, props);
		// }
		// 调用子集组件~~~~左侧票袋列表页
		;(this.onBagRef = this.onBagRef.bind(this)),
			// 调用子集组件~~~~右侧发票展示页面
			(this.onCheckInVoiceRef = this.onCheckInVoiceRef.bind(this)),
			// 修改票袋当前活动触发的函数
			(this.handleChangeActiveDataTableList = this.handleChangeActiveDataTableList.bind(this))
		// 查看发票界面关闭函数
		this.onHanleHiddenCheckInvoce = this.onHanleHiddenCheckInvoce.bind(this)
		// 手动更改勾选的数据行
		this.checkRow = this.checkRow.bind(this)
	}

	/**
	 * @功能:  请求后端刷新~~~移动到按钮的列表加载数组
	 * @作者：Mr.sha
	 * @日期：2022-06-08
	 */
	queryBagMoveData(params) {
		// 当前活跃的ID
		let activeId = this.handleBagActiveId({})
		if (params && params.activeId) {
			activeId = params.activeId
		}

		this.ticketBagActiveId = activeId

		let { getTradeType } = this.props
		let pk_psndoc = ''
		let pk_org = ''
		if (getTradeType) {
			pk_psndoc = getTradeType('jkbxr').value
			pk_org = getTradeType('pk_org').value
		}
		const param = {
			pk_psndoc,
			pk_org,
			pk_erminvoice_bag: activeId
		}
		requestApi.queryBagMoveData({
			data: param,
			success: data => {
				this.setState({ ticketBagArr: data })
			}
		})
	}

	componentDidMount() {
		if (this.props.showInvoiceWalletModal) {
			initTemplate.call(this, this.props)
		}
		this.queryBagMoveData()
	}

	setTransferBtnDisabled(flag) {
		// 设置“冲借款”按钮是否可用
		let btnObj = document.querySelector('.area-right .main-button')
		if (flag == true) {
			btnObj && btnObj.setAttribute('disabled', true)
		} else {
			btnObj && btnObj.removeAttribute('disabled')
		}
	}

	/**
	 * @功能: 修改票袋当前活动触发的函数
	 * @作者：Mr.sha
	 * @日期：2022-06-08
	 * @returns
	 */
	handleChangeActiveDataTableList(params) {
		this.queryBagMoveData(params);
		this.onHanleHiddenCheckInvoce(null);
		initTemplate.call(this, this.props);
	}

	/**
	 * @功能: 移动到的显示文字
	 * @作者：Mr.sha
	 * @日期：2022-06-08
	 * @returns
	 */
	getNCPopoverMoveShowValue(bagname) {
		let showBagname = bagname
		if (showBagname && showBagname.length > this.state.nCPopoverMoveShowValueMaxLength) {
			showBagname = showBagname.substring(0, this.state.nCPopoverMoveShowValueMaxLength) + '...'
		}
		return showBagname
	}

	/**
	 * @功能: 请求后端刷新~~~移动到按钮的列表html
	 * @作者：Mr.sha
	 * @日期：2022-06-08
	 * @returns
	 */
	nCPopoverMoveContentDataTable() {
		return (
			<div
				colors="primary"
				className="move-content-arr"
				onMouseLeave={() => {
					this.setState({ showMovelist: false })
				}}
			>
				{this.state.ticketBagArr.map((item, index) => {
					return (
						<div
							className="move-content"
							onClick={() => {
								this.handleMoveBag(item)
							}}
							key={item.pk_erminvoice_bag}
						>
							{this.getNCPopoverMoveShowValue(item.bagname)}
						</div>
					)
				})}
			</div>
		)
	}

	/**
	 * @功能: 获取bag组件对象
	 * @作者：Mr.sha
	 * @日期：2022-06-06
	 * @param {*} e
	 */
	onBagRef = ref => {
		this.bag = ref
	}

	/**
	 * @功能: 新增按钮触发的函数
	 * @作者：Mr.sha
	 * @日期：2022-05-27
	 * @param {*} e
	 */
	handleBagActiveId(params) {
		return this.bag.handleBagActiveId(params)
	}

	/**
	 * @功能: 发票移动到票袋
	 * @作者：Mr.sha
	 * @日期：2022-06-06
	 * @param {*} params
	 */
	handleMoveBag(params) {
		const multiLang = this.props.MutiInit.getIntl(2011) // this.moduleId
		if (Object.keys(this.deleteList).length > 0) {
			// 勾选的数据
			let checkList = []
			for (let delKey in this.deleteList) {
				if (this.deleteList.hasOwnProperty(delKey) && _.get(this.deleteList, delKey, false)) {
					checkList.push(delKey)
				}
			}
			if (checkList && checkList.length === 0) {
				toast({ content: multiLang.get('201103INUP-0032'), color: 'warning' })
				return
			}
			this.setState({ moveBagPk: params.pk_erminvoice_bag, moveBagName: params.bagname })

			promptBox({
				color: 'warning',
				title:
					multiLang.get("201103INUP-0033") && 
					multiLang.get("201103INUP-0033")
					.replace("{checkListLength}",checkList.length)
					.replace("{moveBagName}",params.bagname)
				,
				noFooter: false,
				noCancelBtn: false,
				// 确认按钮
				beSureBtnName: multiLang['2011-0003'],
				// 取消按钮
				cancelBtnName: multiLang['2011-0002'],
				// hasCloseBtn: true,
				// 确认事件
				beSureBtnClick: () => {
					this.confirmMoveTagModal(checkList)
				},
				// 取消事件
				cancelBtnClick: () => {
					this.closeMoveTagModal()
				}
				// ,
				// closeBtnClick: () => {this.closeMoveTagModal()}
				// ,
				// closeByClickBackDrop: true
			})
		} else {
			toast({ content: multiLang.get('201103INUP-0032'), color: 'warning' })
		}
	}

	/**
	 * @功能: 确定按钮是否可用
	 * @作者：Mr.sha
	 * @日期：2022-07-01
	 */
	confirmDisabled() {
		let confirmDis = false
		let checkList = []
		for (let delKey in this.state.deleteListSelf) {
			if (this.deleteList.hasOwnProperty(delKey) && _.get(this.deleteList, delKey, false)) {
				checkList.push(delKey)
			}
		}
		return !(checkList.length > 0)
	}

	/**
	 * @功能: 确定按钮的class
	 * @作者：Mr.sha
	 * @日期：2022-07-01
	 */
	confirmClass() {
		let classArr = ['confirm-card']
		if (!this.confirmDisabled()) {
			classArr.push('confirm-card-true')
		}
		return classArr.join(' ')
	}

	selectArea = () => {
		let { getTradeType } = this.props
		const multiLang = this.props.MutiInit.getIntl(2011) // this.moduleId
		const that = this
		return (
			<div className="button-area">
				<div>
					{this.state.navTabStatus && this.state.navTabStatus === '33' && this.listTabStatus === '0' && (
						<NCButton
							colors="info"
							onClick={() => {
								const list = []
								for (const key in this.deleteList) {
									if (this.deleteList[key]) {
										list.push(key)
									}
								}
								const param = {
									invoicePkList: list,
									pk_psndoc: getTradeType('jkbxr').value,
									pk_org: getTradeType('pk_org').value
								}

								if (list.length === 0) {
									toast({ content: multiLang.get('201103INUP-0040'), color: 'warning' })
									return false
								}
								requestApi.delete({
									data: param,
									success: data => {
										if (data.success) {
											toast({ content: multiLang.get('201103INUP-0038'), color: 'success' })
										} else {
											toast({ content: multiLang.get('201103INUP-0039') + data.errormsg, color: 'warning' })
										}

										// 刷新列表
										if (this.props.showInvoiceWalletModal) {
											initTemplate.call(that, that.props)
											if (this.bag && this.bag.handleRefTableList) {
												this.bag.handleRefTableList({})
											}
										}
									}
								})
							}}
							size="sm"
						>
							{multiLang && multiLang.get('201103INUP-0001')}
						</NCButton>
					)}
					{/* 移动到 */}
					{this.state.navTabStatus && this.state.navTabStatus === '33' && this.listTabStatus === '0' && (
						<NCPopover
							className="move-tab-option"
							show={this.state.showMovelist}
							content={this.nCPopoverMoveContentDataTable()}
							trigger="click"
							placement="top"
						>
							<NCButton
								colors="info"
								onClick={() => {
									// this.queryBagMoveData();
									this.setState({ showMovelist: true })
								}}
								size="sm"
							>
								{multiLang && multiLang.get('201103INUP-0015')}
							</NCButton>
						</NCPopover>
					)}
				</div>
				<div>
					{/* 确定 */}
					{this.props && !this.props.iswallet && (
						<NCButton
							className={this.confirmClass()}
							disabled={this.confirmDisabled()}
							onClick={() => {
								if (this.props && this.props.associatedApplication) {
									console.log(this.deleteList)
									let checkList = []
									for (let delKey in this.deleteList) {
										if (this.deleteList.hasOwnProperty(delKey) && this.deleteList[delKey]) {
											checkList.push(delKey)
										}
									}
									if (checkList === null || checkList.length === 0) {
										toast({ content: multiLang.get('201103INUP-0141'), color: 'warning' })
									} else {
										this.props.associatedApplication({ checkArr: checkList })
										if (this.props.closeInvoiceWalletModal) {
											this.props.closeInvoiceWalletModal({})
										}
									}
								}
							}}
							size="sm"
						>
							{multiLang && multiLang.get('2011-0003')}
						</NCButton>
					)}
				</div>
			</div>
		)
	}

	/**
	 * @功能: 点击控制~票袋~显隐div的事件
	 * @作者：Mr.sha
	 * @日期：2022-06-07
	 * @returns
	 */
	bagShowOrHidden() {
		this.setState({ bagIsHidden: !this.state.bagIsHidden })
	}

	/**
	 * @功能: 获取控制~票袋~显隐的class样式
	 * @作者：Mr.sha
	 * @日期：2022-06-07
	 * @returns
	 */
	getBagShowDivClassNameArr() {
		let classNameArr = ['bag-show-hidden-init']
		if (this.state && !this.state.bagIsHidden) {
			classNameArr.push('bag-show-hidden-to-show')
		}
		return classNameArr.join(' ')
	}

	getParams(getTradeType) {
		let params = null
		if (getTradeType) {
			params = { pk_psndoc: getTradeType('jkbxr').value, pk_org: getTradeType('pk_org').value }
		}
		return params
	}

	/**
	 * @功能：关闭右侧查看发票的显示div
	 * @作者：Mr.sha
	 * @日期：2022-06-13
	 * @param {*} params
	 */
	onHanleHiddenCheckInvoce(params) {
		this.setState({ checkInvoceIsHidden: true })
	}

	/**
	 * @功能: 获取CheckInVoice组件对象
	 * @作者：Mr.sha
	 * @日期：2022-06-10
	 * @param {*} checkInVoice
	 */
	onCheckInVoiceRef(checkInVoice) {
		this.checkInVoice = checkInVoice
	}

	/**
	 * @功能: 调用CheckInVoice组件对象的handleChangeInvoice方法
	 * @作者：Mr.sha
	 * @日期：2022-06-10
	 * @param {*} params
	 */
	onhandleChangeInvoice(params) {
		this.setState({ checkRowData: params })
		if (this && this.checkInVoice) {
			this.checkInVoice.onhandleChangeInvoice(params)
		}
	}

	/**
	 * @功能: 手动更改勾选的数据行
	 * @作者：Mr.sha
	 * @日期：2022-06-15
	 * @param {*} params
	 */
	checkRow(params) {}

	/**
	 * @功能: 获取table列表的宽度
	 * @作者：Mr.sha
	 * @日期：2022-06-13
	 */
	getContentMainStyle() {
		let mainStyle = { width: '99%' }
		let styleWidth = 99
		// 显示左侧的票袋
		if (!this.state.bagIsHidden && this.state.navTabStatus === '33') {
			styleWidth -= 18
		}
		// 显示右侧的发票
		if (!this.state.checkInvoceIsHidden) {
			styleWidth -= 30
		}
		mainStyle = { width: styleWidth + '%' }
		return mainStyle
	}

	/**
	 * @功能: 获取票袋列表的宽度
	 * @作者：Mr.sha
	 * @日期：2022-06-13
	 */
	getContentLeftStyle() {
		let leftStyle = { width: '0%' }
		let styleWidth = 0
		// 显示左侧的票袋
		if (!this.state.bagIsHidden) {
			styleWidth = 18
		}
		leftStyle = { width: styleWidth + '%' }
		return leftStyle
	}

	/**
	 * @功能: 获取查验发票的宽度
	 * @作者：Mr.sha
	 * @日期：2022-06-13
	 */
	getContentRightStyle() {
		let rightStyle = { width: '0%' }
		let styleWidth = 0
		// 显示右侧的发票
		if (!this.state.checkInvoceIsHidden) {
			styleWidth = 32
		}
		rightStyle = { width: styleWidth + '%' }
		return rightStyle
	}

	componentDidUpdate(newPros,newState) {
		let transfertableMain = document.getElementsByClassName('transfertable-main');
		if(!_.isEmpty(transfertableMain) && transfertableMain.length > 0 &&
		(this.state.transfertableMain + "px") !== transfertableMain[0].style['height']){
			for(let i = 0 ;i < transfertableMain.length ;i++){
				transfertableMain[i].style['height'] = this.state.transfertableMain + "px";
			}
		}
	}

	
	/**
	 * @功能: tab主界面
	 * @作者：Mr.sha
	 * @日期：2022-05-30
	 * @param {*} params, tabData
	 */
	getHtmlMainRender(params, tabData) {
		let { search, transferTable, getTradeType, NCCreateSearch, createTransferTable, multiLang } = params
		return (
			<div>
				<div className="nc-singleTable-search">
					<div className='nc-singleTable-search-area'>
						{this.listTabStatus === '0' && NCCreateSearch(
							window.InvoiceWalletAreaCode.searchArea, // 模块id
							{
								clickPlanEve: searchClick.bind(this), // 点击高级面板中的查询方案事件
								clickSearchBtn: searchClick.bind(this), //   点击按钮事件
								defaultConditionsNum: 1, // 默认显示几个查询条件
								onAfterEvent: afterEvent() // 编辑后事件
							}
						)}
						{this.listTabStatus === '1' && NCCreateSearch(
							config.searchArea, // 模块id
							{
								clickPlanEve: searchClick.bind(this), // 点击高级面板中的查询方案事件
								clickSearchBtn: searchClick.bind(this), //   点击按钮事件
								defaultConditionsNum: 1, // 默认显示几个查询条件
								onAfterEvent: afterEvent() // 编辑后事件
							}
						)}
					</div>
				</div>

				{/* 中间数据列表 */}
				<div className="area-content-center area-content-left-center" id="transferInvoiceWallet">
					{tabData && tabData.key === '33' && this.listTabStatus === '0' && (
						//   左侧票袋列表
						<div className="area-content-left" style={this.getContentLeftStyle()}>
							<TicketBag
								onBagRef={this.onBagRef}
								bagIsHidden={this.state.bagIsHidden}
								handleChangeActiveDataTableList={this.handleChangeActiveDataTableList}
								getCardData={this.props.getCardData}
								params={this.getParams(getTradeType)}
								transfertableMainHeight = {this.state.transfertableMain}
							/>
							<div
								className={this.getBagShowDivClassNameArr()}
								onClick={() => {
									this.bagShowOrHidden()
								}}
							>
								{/* 控制~票袋~显隐  */}
								<img className="bag-show-hidden-to-show-img" src={imgUrl}></img>
							</div>
						</div>
					)}
					{this.listTabStatus === '0' && ( 
						<div className="area-content-main" style={this.getContentMainStyle()}>
						{createTransferTable({
							headTableId: window.InvoiceWalletAreaCode.billsArea, // 表格组件id
							bodyTableId: window.InvoiceWalletAreaCode.bodysArea, // 子表模板id
							fullTableId: window.InvoiceWalletAreaCode.bodysArea, // 主子拉平模板id
							comType: this.state.navTabStatus === '33' ? 'hasCheckBox_child' : '',
							// 点击加号展开，设置表格数据
							transferBtnText: multiLang && multiLang.get('201103INUP-0005'), // 转单按钮显示文字
							showSeletedBtn: this.state.navTabStatus === '33',
							showGenerateBtn: this.state.navTabStatus === '33',
							containerSelector: '#transferInvoiceWallet', // 容器的选择器 必须唯一,用于设置底部已选区域宽度
							showChangeViewBtn: false,
							selectArea: this.selectArea,
							showPagination: true,
							onPageInfoChange: searchClick.bind(this,this.props),
							onTransferBtnClick: ids => {
								// 点击转单按钮钩子函数
								const invoicePkList = []
								if (ids && ids.length > 0) {
									ids.forEach(item => {
										invoicePkList.push(item.head.pk)
									})
								}

								if (!getTradeType('pk_tradetypeid')) {
									toast({ content: multiLang.get('201103INUP-0030') })
									return
								}
								const tradetype = getTradeType('pk_tradetypeid').value

								const pjdata = {
									invoicePkList: invoicePkList,
									tradetype: tradetype
								}

								const list = this.props.transferTable.getTransferTableSelectedValue().head || []
								let err = false
								if (list.length > 0) {
									for (let i = 0; i < list.length; i++) {
										const item = list[i]
										if (Number(item.head.head.rows[0].values.purchaserstatus && item.head.head.rows[0].values.purchaserstatus.value) >= 36) {
											toast({ content: multiLang.get('201103INUP-0031'), color: 'danger' })
											err = true
											break
										}
									}
								}
								if (!err) {
									window.pageInvoiceToBxClick(pjdata)
								}
							},
							onCheckedChange: (flag, record, index, bodys) => {
								// 全选
								if (Array.isArray(record)) {
									const keys = record.map(itm => itm.pk_erminvoice.value)
									keys.forEach(key => {
										if (flag == true) {
											this.deleteList[key] = true
										} else if (flag == false) {
											this.deleteList[key] = false
										}
									})
								} else {
									// 单选条件
									// C:\work\ncc-erm-front-template\ncc-erm-front-template-master-532ec24b9d47c11450dd8c519dd16162adb22291\src\erm\expenseaccount\wallet\card\index.js
									const key = record.pk_erminvoice.value
									let child_key = record.pk_erminvoice_b && record.pk_erminvoice_b.value
									// 勾选子表 -> 全选
									let body_keys = []
									this.invoiceList.forEach(item => {
										if (item.head.head.rows[0].values.pk_erminvoice.value === key) {
											if (item.body) {
												body_keys = item.body.body.rows.map(_itm => {
													if (_itm.values.pk_erminvoice_b.value !== child_key) return _itm.values.pk_erminvoice_b.value
												})
											}
										}
									})

									// 只勾选兄弟元素，否则计算错误
									body_keys = body_keys.filter(itm => itm && itm)
									if (child_key && body_keys.length > 0 && flag) {
										this.props.transferTable.setTheCheckRows('head', body_keys)
									}
									if (child_key && body_keys.length > 0 && !flag) {
										this.props.transferTable.cancelRowsChecked('head', [key])
									}

									if (flag == true) {
										this.deleteList[key] = true
									} else if (flag == false) {
										this.deleteList[key] = false
									}
								}

								this.setState({ deleteListSelf: this.deleteList })
							},
							onChangeViewClick: () => {
								// 点击切换视图钩子函数
								if (!this.props.meta.getMeta()[window.InvoiceWalletAreaCode.bodysArea]) {
									initTemplate.call(this, this.props) // 加载主子拉平模板
								}
								this.props.transferTable.changeViewType(this.headTableId)
							},
							onSelectedBtnClick: () => {
							},
							style: () => {
								return { width: '200px' }
							}
						})}
						</div>
					)}
					{this.listTabStatus === '1' && (
						<OrderTableArea 
							createTransferTable={createTransferTable}
							that={this}
						/>
					)}

					{/* 右侧校验发票 */}
					{this.listTabStatus === '0' && (
						<div>
							<div className="area-content-right" style={this.getContentRightStyle()}>
								<CheckInVoice
									checkInvoceIsHidden={this.state.checkInvoceIsHidden}
									onHanleHiddenCheckInvoce={this.onHanleHiddenCheckInvoce}
									onCheckInVoiceRef={this.onCheckInVoiceRef}
									invoiceList={this.invoiceList}
									checkRowData={this.state.checkRowData}
									checkRow={this.checkRow}
									showDiv={this.props.showDiv}
									transfertableMainHeight = {this.state.transfertableMain}
								/>
							</div>
							{this.getMoveTagModalHtml()}
						</div>
					)}
				</div>
			</div>
		)
	}

	/**
	 * @功能: 确认移动到的操作
	 * @作者：Mr.sha
	 * @日期：2022-06-08
	 * @checkList 勾选的数据
	 */
	confirmMoveTagModal(checkList) {
		const multiLang = this.props.MutiInit.getIntl(2011)
		// 发票信息移动到的pk主键
		let pk_erminvoice_bag = this.state.moveBagPk
		// 暂时模拟赋值
		this.setState({ moveBagPk: null })
		if (Array.isArray(checkList) && checkList.length > 0) {
			let { getTradeType } = this.props
			let paramsAdd = null
			if (getTradeType) {
				paramsAdd = { pk_psndoc: getTradeType('jkbxr').value, pk_org: getTradeType('pk_org').value }
			}
			// 参数
			const params = { ...paramsAdd, invoices: checkList, pk_erminvoice_bag }
			requestApi.bagMoveData({
				data: params,
				success: data => {
					toast({ content: data[0]['message'], color: 'success' })
					setTimeout(() => {
						// 刷新左侧票袋列表
						this.bag.handleRefTableList({})
						initTemplate.call(this, this.props)
						this.closeMoveTagModal()
					}, 1000)
				}
			})
		} else {
			toast({ content: multiLang.get('201103INUP-0032'), color: 'warning' })
		}
	}

	/**
	 * @功能: 关闭移动到的确认框
	 * @作者：Mr.sha
	 * @日期：2022-06-08
	 */
	closeMoveTagModal() {
		this.setState({ showMoveTagModal: false })
	}

	getMoveTagModalHtml() {
		const multiLang = this.props.MutiInit.getIntl(2011)

		return (
			<div>
				<NCModal
					size="sm"
					show={this.state.showMoveTagModal}
					onHide={() => {
						this.closeMoveTagModal()
					}}
				>
					<NCModal.Header closeButton>
						<NCModal.Title>{multiLang.get('2011-0020')}</NCModal.Title>
					</NCModal.Header>

					<NCModal.Body>
						<div className="move-tag-modal-main">
							<div class="move-tag-modal-icon"></div>
							<div class="move-tag-modal-right">
								<div class="move-tag-modal-title">
									{
										multiLang.get("201103INUP-0033") && 
										multiLang.get("201103INUP-0033")
										.replace("{checkListLength}",Object.keys(this.deleteList).length)
										.replace("{moveBagName}",this.state.moveBagName)
									}
								</div>
							</div>
						</div>
					</NCModal.Body>

					<NCModal.Footer>
						<NCButton
							onClick={() => {
								this.confirmMoveTagModal()
							}}
							bordered
						>
							{multiLang.get('2011-0003')}
						</NCButton>
						<NCButton
							onClick={() => {
								this.closeMoveTagModal()
							}}
							colors="secondary"
							style={{ marginRight: 8 }}
						>
							{multiLang.get('2011-0002')}
						</NCButton>
					</NCModal.Footer>
				</NCModal>
			</div>
		)
	}

	render() {
		let { search, transferTable, getTradeType } = this.props
		let { NCCreateSearch } = search
		let { createTransferTable } = transferTable
		const multiLang = this.props.MutiInit.getIntl(2011) // this.moduleId

		let params = {
			search,
			transferTable,
			getTradeType,
			NCCreateSearch,
			createTransferTable,
			multiLang
		}

		return (
			<div className="container">
				<NCTabs
					onChange={key => {
						// this.props.search.clearSearchArea(window.InvoiceWalletAreaCode.searchArea)
						if(this.listTabStatus === '0'){
							this.props.transferTable.setTransferTableValue(config.orderListArea, config.bodysArea, [], 'pk_ermorder', 'pk_ermorder_b');

						}
						if(this.listTabStatus === '1'){
							this.props.transferTable.setTransferTableValue(
								window.InvoiceWalletAreaCode.billsArea,
								window.InvoiceWalletAreaCode.bodysArea,
								[],
								'pk_erminvoice',
								'pk_erminvoice_b'
							)
						}
						this.setState({ navTabStatus: key, checkInvoceIsHidden: true, bagIsHidden: false })
						initTemplate.call(this, this.props)
					}}
					animated={false}
				>
					{this.state.tabData.map((item, index) => {
						return (
							<NCTabPane tab={item.title} key={item.key}>
								{this.getHtmlMainRender(params, item)}
							</NCTabPane>
						)
					})}
				</NCTabs>
				<div className='nc-list-tabs'>
					<NCTabs
					onChange={(key) => {
						this.props.transferTable.setTransferTableValue(
							window.InvoiceWalletAreaCode.billsArea,
							window.InvoiceWalletAreaCode.bodysArea,
							[],
							'pk_erminvoice',
							'pk_erminvoice_b'
						)
                                			this.props.transferTable.setTransferTableValue(config.orderListArea, config.bodysArea, [], 'pk_ermorder', 'pk_ermorder_b');
						this.listTabStatus = key
						initTemplate.call(this, this.props)
					}}
					animated={false}
					>
					{this.state.listTabData.map((item, index) => {
						return (
							<NCTabPane tab={item.title} key={item.key}>
							</NCTabPane>
						)
					})}
					</NCTabs>
				</div>
			</div>
		)
	}
}

InvoiceWallet = createPage({
	mutiLangCode: '2011'
})(InvoiceWallet)

ReactDOM.render(<InvoiceWallet />, document.querySelector('#app'))
